﻿<UserControl
    x:Class="Xyzzer.AsyncUI.EventDrivenCustomDialog"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    <UserControl.Resources>
        <DataTemplate
            x:Name="CloseButtonTemplate">
            <Button
                Background="#10A151"
                FontSize="14.67" />
        </DataTemplate>

        <Storyboard
            x:Name="SlideInStoryboard"
            Duration="0:0:1.5">
            <DoubleAnimation
                Storyboard.TargetName="DialogPopup"
                Storyboard.TargetProperty="Opacity"
                From="0"
                To="1"
                Duration="0:0:0.5" />
            <DoubleAnimation
                x:Name="SlideInAnimation"
                Storyboard.TargetName="ContentBorderTranslation"
                Storyboard.TargetProperty="X"
                From="1000"
                To="0"
                BeginTime="0:0:0.5"
                Duration="0:0:1">
                <DoubleAnimation.EasingFunction>
                    <ElasticEase
                        EasingMode="EaseOut"
                        Oscillations="1"
                        Springiness="8" />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>

        <Storyboard
            x:Name="SlideOutStoryboard"
            Duration="0:0:1.5"
            Completed="SlideOutStoryboard_Completed">
            <DoubleAnimation
                x:Name="SlideOutAnimation"
                Storyboard.TargetName="ContentBorderTranslation"
                Storyboard.TargetProperty="X"
                From="0"
                To="-1000"
                Duration="0:0:1">
                <DoubleAnimation.EasingFunction>
                    <ElasticEase
                        EasingMode="EaseIn"
                        Oscillations="1"
                        Springiness="8" />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
            <DoubleAnimation
                Storyboard.TargetName="DialogPopup"
                Storyboard.TargetProperty="Opacity"
                From="1"
                To="0"
                BeginTime="0:0:1"
                Duration="0:0:5" />
        </Storyboard>
    </UserControl.Resources>
    <Popup
        x:Name="DialogPopup">
        <Grid
            x:Name="LayoutRoot"
            Background="#80000000">
            <Border
                x:Name="BlackStripe"
                Background="Black"
                VerticalAlignment="Center"
                HorizontalAlignment="Stretch">
                <Border
                    x:Name="ContentBorder"
                    BorderBrush="White"
                    BorderThickness="2"
                    Background="#0D8845"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Center"
                    Margin="0,25">
                    <Border.RenderTransform>
                        <TranslateTransform
                            x:Name="ContentBorderTranslation" />
                    </Border.RenderTransform>
                    <StackPanel
                        x:Name="ContentPanel"
                        Margin="25"
                        MinWidth="200">
                        <TextBlock
                            x:Name="TitleTextBlock"
                            FontFamily="Segoe UI"
                            FontSize="26.67" />

                        <TextBlock
                            x:Name="TextTextBlock"
                            FontFamily="Segoe UI Semilight"
                            FontSize="14.67"
                            Margin="0,25" />

                        <StackPanel
                            x:Name="ButtonsPanel"
                            Orientation="Horizontal"
                            HorizontalAlignment="Right" />
                    </StackPanel>
                </Border>
            </Border>
        </Grid>
    </Popup>
</UserControl>